import React from 'react'
import { ImageBackground, StyleSheet, Text, View ,TouchableOpacity} from 'react-native'

const UserIncome= ()=> {
  const handlePress = ()=>{
    console.log('立即提现')
  }
    return (
      <ImageBackground 
      source={require('../../assets/images/userIncome.png')}
      style={{width:355,height:160,padding:10}}
      >
         <View style={{flexDirection:'row',justifyContent:'space-between',marginBottom:22}}>
          <View style={{flexDirection:'row',alignItems:'baseline'}}>
            <Text style={{fontSize:12,color:'white',textAlign:'justify'}}>可提现¥</Text>
            <Text style={{fontSize:22,color:'white',textAlign:'right',marginLeft:5}}>12345</Text>
          </View>
          <View>
            <TouchableOpacity onPress={handlePress} style={styles.buttonWithdrawDeposit}>
              <Text style={{lineHeight:27,textAlign:'center'}}>立即提现</Text>
            </TouchableOpacity>
          </View>
         </View>
         <View style={{flexDirection:'row',justifyContent:'center'}}>
          <View style={{borderRightWidth:1,borderRightColor:'#fff',flex:1}}>
            <Text style={styles.extimatedIncomeFont}>今日预估（元）</Text>
            <Text style={[styles.fontWhite]}>123</Text>
          </View>
          <View style={{borderRightWidth:1,borderColor:'#fff',borderLeftColor:'#df3d36',borderLeftWidth:1,flex:1}}>
            <Text style={styles.extimatedIncomeFont}>本月预估（元）</Text>
            <Text style={[styles.fontWhite]}>1230</Text>
          </View>
          <View style={{flex:1,borderLeftColor:'#df3d36',borderLeftWidth:1}}>
            <Text style={styles.extimatedIncomeFont}>上月预估（元）</Text>
            <Text style={[styles.fontWhite]}>2230</Text>
          </View>
         </View>
         <View>
          <Text style={{color:'white',fontSize:10,marginTop:25}}>每月15号提现上月确认收货的订单收入</Text>
         </View>
      </ImageBackground>
    )
}
const styles=StyleSheet.create({
  fontWhite:{
    color:'white',
    textAlign:'center',
    fontSize:18,
  },
  buttonWithdrawDeposit:{
    color:'#df3d36',
    width:80,
    height:27,
    opacity:0.7,
    backgroundColor:'#fff',
    borderWidth:0,
    borderRadius:14
  },
  extimatedIncomeFont:{
    color:'white',
    fontSize:13,
    textAlign:'center',
    marginBottom:16
  }
})

export { UserIncome }


